home *** CD-ROM | disk | FTP | other *** search
/ Personal Computer World 2006 May / PCWMAY06.iso / Software / Freeware / First Page 2006 3.00 / fp2006-final-3.00-setup.exe / {app} / Iscripts / DHTML - Menus / tabs-menu.izs < prev   
Text File  |  2005-09-02  |  6KB  |  157 lines
  1. <!NOWIZARD>
  2.  
  3. <!TITLE>Tabs Menu (mouseover)
  4. <!/TITLE>
  5.  
  6. <!BROWSER>FF1+ IE5+ Opr7+<!/BROWSER>
  7.  
  8. <!DESCRIPTION> This is a mouseover tabs menu. Move the mouse over designated links, and additional "sub links" appear beneath it. Think of it as an inline two level menu.
  9.  
  10. We intentionally made this script with a minimum amount of styling, so you can personalize its look yourself. As an example, the main links could be substituted with "tab" images instead.
  11.  
  12. <!/DESCRIPTION> 
  13.  
  14. <!CATEGORY>drop down menus<!/CATEGORY>
  15.  
  16. <!SCRIPT>
  17. <!-- START OF SCRIPT -->
  18. <!--Links used to initiate the sub menus. Pass in the desired submenu index numbers (ie: 0, 1) -->
  19. <a href="http://www.javascriptkit.com" onMouseover="showit(0)">JavaScript Kit</a> | <a href="http://freewarejava.com" onMouseover="showit(1)">Freewarejava</a><br>
  20.  
  21. <!-- Edit the dimensions of the below, plus background color-->
  22. <ilayer width=400 height=32 name="dep1" bgColor="#E6E6FF">
  23. <layer name="dep2" width=400 height=32>
  24. </layer>
  25. </ilayer>
  26. <div id="describe" style="background-color:#E6E6FF;width:400px;height:32px" onMouseover="clear_delayhide()" onMouseout="resetit(event)"></div>
  27.  
  28.  
  29. <script language="JavaScript1.2">
  30.  
  31. /*
  32. Tabs Menu (mouseover)- By Dynamic Drive
  33. For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
  34. This credit MUST stay intact for use
  35. */
  36.  
  37. var submenu=new Array()
  38.  
  39. //Set submenu contents. Expand as needed. For each content, make sure everything exists on ONE LINE. Otherwise, there will be JS errors.
  40.  
  41. submenu[0]='<font size="2" face="Verdana"><b><a href="http://www.javascriptkit.com/cutpastejava.shtml">Scripts</a> | <a href="http://www.javascriptkit.com/javaindex.shtml">JS tutorials</a> | <a href="http://www.javascriptkit.com/javatutors/index.shtml">Advanced JS tutorials</a> | <a href="http://www.javascriptkit.com/java/">Applets</a> | <a href="http://www.javascriptkit.com/howto/">Web Tutorials</a></b></font>'
  42.  
  43. submenu[1]='<font size="2" face="Verdana"><b><a href="http://freewarejava.com/applets/index.shtml">Applets</a> | <a href="http://freewarejava.com/tutorials/index.shtml">Tutorials</a> | <a href="http://freewarejava.com/javasites/index.shtml">Sites and Zines</a> | <a href="http://freewarejava.com/jsp/index.shtml">JSP</a></b></font>'
  44.  
  45. //Set delay before submenu disappears after mouse moves out of it (in milliseconds)
  46. var delay_hide=500
  47.  
  48. /////No need to edit beyond here
  49.  
  50. var menuobj=document.getElementById? document.getElementById("describe") : document.all? document.all.describe : document.layers? document.dep1.document.dep2 : ""
  51.  
  52. function showit(which){
  53. clear_delayhide()
  54. thecontent=(which==-1)? "" : submenu[which]
  55. if (document.getElementById||document.all)
  56. menuobj.innerHTML=thecontent
  57. else if (document.layers){
  58. menuobj.document.write(thecontent)
  59. menuobj.document.close()
  60. }
  61. }
  62.  
  63. function resetit(e){
  64. if (document.all&&!menuobj.contains(e.toElement))
  65. delayhide=setTimeout("showit(-1)",delay_hide)
  66. else if (document.getElementById&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
  67. delayhide=setTimeout("showit(-1)",delay_hide)
  68. }
  69.  
  70. function clear_delayhide(){
  71. if (window.delayhide)
  72. clearTimeout(delayhide)
  73. }
  74.  
  75. function contains_ns6(a, b) {
  76. while (b.parentNode)
  77. if ((b = b.parentNode) == a)
  78. return true;
  79. return false;
  80. }
  81.  
  82. </script>
  83. <!-- END OF SCRIPT -->
  84. <!/SCRIPT>
  85.  
  86. <!PREVIEW>
  87. <!-- START OF SCRIPT -->
  88.  
  89. <!--Links used to initiate the sub menus. Pass in the desired submenu index numbers (ie: 0, 1) -->
  90. <a href="http://www.javascriptkit.com" onMouseover="showit(0)">JavaScript Kit</a> | <a href="http://freewarejava.com" onMouseover="showit(1)">Freewarejava</a><br>
  91.  
  92. <!-- Edit the dimensions of the below, plus background color-->
  93. <ilayer width=400 height=32 name="dep1" bgColor="#E6E6FF">
  94. <layer name="dep2" width=400 height=32>
  95. </layer>
  96. </ilayer>
  97. <div id="describe" style="background-color:#E6E6FF;width:400px;height:32px" onMouseover="clear_delayhide()" onMouseout="resetit(event)"></div>
  98.  
  99.  
  100. <script language="JavaScript1.2">
  101.  
  102. /*
  103. Tabs Menu (mouseover)- By Dynamic Drive
  104. For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
  105. This credit MUST stay intact for use
  106. */
  107.  
  108. var submenu=new Array()
  109.  
  110. //Set submenu contents. Expand as needed. For each content, make sure everything exists on ONE LINE. Otherwise, there will be JS errors.
  111.  
  112. submenu[0]='<font size="2" face="Verdana"><b><a href="http://www.javascriptkit.com/cutpastejava.shtml">Scripts</a> | <a href="http://www.javascriptkit.com/javaindex.shtml">JS tutorials</a> | <a href="http://www.javascriptkit.com/javatutors/index.shtml">Advanced JS tutorials</a> | <a href="http://www.javascriptkit.com/java/">Applets</a> | <a href="http://www.javascriptkit.com/howto/">Web Tutorials</a></b></font>'
  113.  
  114. submenu[1]='<font size="2" face="Verdana"><b><a href="http://freewarejava.com/applets/index.shtml">Applets</a> | <a href="http://freewarejava.com/tutorials/index.shtml">Tutorials</a> | <a href="http://freewarejava.com/javasites/index.shtml">Sites and Zines</a> | <a href="http://freewarejava.com/jsp/index.shtml">JSP</a></b></font>'
  115.  
  116. //Set delay before submenu disappears after mouse moves out of it (in milliseconds)
  117. var delay_hide=500
  118.  
  119. /////No need to edit beyond here
  120.  
  121. var menuobj=document.getElementById? document.getElementById("describe") : document.all? document.all.describe : document.layers? document.dep1.document.dep2 : ""
  122.  
  123. function showit(which){
  124. clear_delayhide()
  125. thecontent=(which==-1)? "" : submenu[which]
  126. if (document.getElementById||document.all)
  127. menuobj.innerHTML=thecontent
  128. else if (document.layers){
  129. menuobj.document.write(thecontent)
  130. menuobj.document.close()
  131. }
  132. }
  133.  
  134. function resetit(e){
  135. if (document.all&&!menuobj.contains(e.toElement))
  136. delayhide=setTimeout("showit(-1)",delay_hide)
  137. else if (document.getElementById&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
  138. delayhide=setTimeout("showit(-1)",delay_hide)
  139. }
  140.  
  141. function clear_delayhide(){
  142. if (window.delayhide)
  143. clearTimeout(delayhide)
  144. }
  145.  
  146. function contains_ns6(a, b) {
  147. while (b.parentNode)
  148. if ((b = b.parentNode) == a)
  149. return true;
  150. return false;
  151. }
  152.  
  153. </script>
  154. <!-- END OF SCRIPT -->
  155. <!/PREVIEW>
  156.  
  157. <!RELATED>NONE<!/RELATED>